<template>
  <view class="mes-info pad20">
    <sb-back-icon />
    <u-cell-group class="shadow-line radius20 pad20 bg-white" :border="false">
      <u-cell-item
        title="处理通知"
        :label="$fmtTime(mesInfo.updatedAt)"
        :arrow="false"
        :border-bottom="false"
      ></u-cell-item>
      <view class="padh30">
        <view class="mes-title font32 marv10">{{ mesInfo.title }}</view>
        <view class="marv20"><u-parse :html="mesInfo.content" /></view>
      </view>
      <u-cell-item
        v-if="mesInfo.relationType !== 2"
        title="查看详情"
        @click="toDetail"
        :border-bottom="false"
        border-top
      ></u-cell-item>
    </u-cell-group>
  </view>
</template>

<script>
export default {
  data() {
    return {
      id: "",
      mesInfo: {},
    };
  },
  onLoad({ id }) {
    if (id) this.id = id;
  },
  onShow() {
    this.getMesdetail();
  },
  methods: {
    async getMesdetail() {
      let { success, data } = await this.$get("/notice/detail", {
        id: this.id,
      });
      if (success && data) this.mesInfo = data;
    },
    toDetail() {
      const { relationType } = this.mesInfo;
      if (relationType === 1) {
        this.$go2(`/pages/main/order/order-info?id=${this.mesInfo.relationId}`);
      } else if (relationType === 3) {
        this.$go2(`/pages/main/tabbar/mine/discount-coupon`);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.mes-info {
  .mes-title {
    font-weight: bold;
    color: $main-color;
  }
}
</style>
